HTMLify
style.css
Views: 5 | Author: cody
@import "https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap";
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background-color: #141414;
overflow-x: hidden;
overscroll-behavior-y: none;
min-height: 100vh;
}
.img-gallery-ctr {
width: 100vw;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-block: 10vh;
}
.img-gallery-ctr.order {
display: grid;
}
.img-gallery_content {
position: relative;
border-radius: 0.5rem;
margin-bottom: 1em;
width: 400px;
height: 500px;
overflow: hidden;
}
.img-gallery_content.reorder {
position: fixed;
top: 1rem;
left: 1rem;
width: 150px;
height: 200px;
}
img {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
}
.btn {
font-family: "poppins", sans-serif;
cursor: pointer;
width: 10em;
height: 5rem;
z-index: 10;
position: absolute;
right: 0;
top: 0;
display: flex;
align-items: center;
justify-content: center;
background-color: transparent;
color: #fff;
outline: transparent;
border: none;
}